import { createRouter, createWebHistory } from 'vue-router'
import { useUserStore } from '@/stores'

// createRouter 创建路由实例
// 配置 history 模式
// 1. history模式：createWebHistory     地址栏不带 #
// 2. hash模式：   createWebHashHistory 地址栏带 #
// console.log(import.meta.env.DEV)

// vite 中的环境变量 import.meta.env.BASE_URL  就是 vite.config.js 中的 base 配置项
import Props from '@/pages/044_组件通信/01_props/Father.vue'
import Event from '@/pages/044_组件通信/02_custom-event/Father.vue'
import Mitt from '@/pages/044_组件通信/03_mitt/Father.vue'
import Model from '@/pages/044_组件通信/04_v-model/Father.vue'
import TablePrint from '@/views/practise/table/TablePrint.vue'
import LifeTable from '@/views/practise/table/LifeTable.vue'
import PaduaTable from '@/views/practise/table/PaduaTable.vue'
import FallTable from '@/views/practise/table/FallTable.vue'
import MechanicalVentilationNew from '@/views/practise/table/MechanicalVentilationNew.vue'
import DischargeHandover from '@/views/practise/table/DischargeHandover.vue'
import bloodGlucose from '@/views/practise/table/bloodGlucose.vue'

import BloodTransfusion from '@/views/practise/pages/bloodTransfusion/index.vue'
import rescue from '@/views/practise/pages/rescue/index.vue'
import Demotemplate from '@/views/practise/components/Demotemplate.vue'
import demo from '@/views/practise/components/FatherPage.vue'
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    { path: '/login', component: () => import('@/views/login/LoginPage.vue') }, // 登录页
    {
      path: '/',
      component: () => import('@/views/layout/LayoutContainer.vue'),
      redirect: '/article/manage',
      children: [
        {
          path: '/article/manage',
          component: () => import('@/views/article/ArticleManage.vue'),
        },
        {
          path: '/article/channel',
          component: () => import('@/views/article/ArticleChannel.vue'),
        },
        {
          path: '/user/profile',
          component: () => import('@/views/user/UserProfile.vue'),
        },
        {
          path: '/user/avatar',
          component: () => import('@/views/user/UserAvatar.vue'),
        },
        {
          path: '/user/password',
          component: () => import('@/views/user/UserPassword.vue'),
        },
        {
          path: '/practise/demoPage',
          component: () => import('@/views/practise/demoPage.vue'),
        },
        {
          path: '/practise/richText',
          component: () => import('@/views/practise/richText.vue'),
        },
        {
          path: '/practise/richText-vueup',
          component: () => import('@/views/practise/richText-vueup.vue'),
        },
        {
          path: '/practise/TablePage',
          component: () => import('@/views/practise/TablePage.vue'),
        },
        {
          path: '/practise/TablePrint',
          component: () => import('@/views/practise/TablePrint.vue'),
        },
        {
          path: '/demo',
          component: demo,
        },
        {
          path: '/props',
          component: Props,
        },
        {
          path: '/event',
          component: Event,
        },
        {
          path: '/mitt',
          component: Mitt,
        },
        {
          path: '/model',
          component: Model,
        },
        {
          path: '/attrs',
          component: () => import('@/pages/044_组件通信/05_$attrs/Father.vue'),
        },
        {
          path: '/$refs-$parent',
          component: () => import('@/pages/044_组件通信/06_$refs-$parent/Father.vue'),
        },

        {
          path: '/provide-inject',
          component: () => import('@/pages/044_组件通信/07_provide-inject/Father.vue'),
        },
        {
          path: '/slot',
          component: () => import('@/pages/044_组件通信/09_slot/Father.vue'),
        },
        {
          path: '/shallowRef-shallowReactive',
          component: () => import('@/pages/045_shallowRef与shallowReactive/index.vue'),
        },

        {
          path: '/readonly-shallowReadonly',
          component: () => import('@/pages/046_readonly-shallowReadonly/index.vue'),
        },
        {
          path: '/toRaw-markRaw',
          component: () => import('@/pages/047_toRaw-markRaw/index.vue'),
        },
        {
          path: '/TablePrint',
          component: TablePrint,
        },
        {
          path: '/LifeTable',
          component: LifeTable,
        },
        {
          path: '/PaduaTable',
          component: PaduaTable,
        },
        {
          path: '/FallTable',
          component: FallTable,
        },
        {
          path: '/MechanicalVentilationNew',
          component: MechanicalVentilationNew,
        },

        {
          path: '/DischargeHandover',
          component: DischargeHandover,
        },

        {
          path: '/bloodGlucose',
          component: bloodGlucose,
        },

        {
          path: '/Demotemplate',
          component: Demotemplate,
        },

        {
          path: '/BloodTransfusion',
          component: BloodTransfusion,
        },
        {
          path: '/rescue',
          component: rescue,
        },
      ],
    },
  ],
})

// 登录访问拦截 => 默认是直接放行的
// 根据返回值决定，是放行还是拦截
// 返回值：
// 1. undefined / true  直接放行
// 2. false 拦回from的地址页面
// 3. 具体路径 或 路径对象  拦截到对应的地址
//    '/login'   { name: 'login' }
router.beforeEach((to) => {
  // 如果没有token, 且访问的是非登录页，拦截到登录，其他情况正常放行
  const useStore = useUserStore()
  if (!useStore.token && to.path !== '/login') return '/login'
})

export default router
